import React from "react";
import {inject, observer} from 'mobx-react';
import {InputItem, List, Modal, Tools, Toast, Bubble} from "weaver-mobile";
import * as mobx from 'mobx';

import * as pageTypes from "../../constants/OdocPageType";

const getLabel = Tools.getLabel;

@inject("odocRequestStore", "odocComsStore")
@observer
export default class Main extends React.Component {
    constructor(props) {
        super(props);

        this.state = {};

        this.closeDialog = this.closeDialog.bind(this);
        this.saveDirection = this.saveDirection.bind(this);
    }

    saveDirection() {
        const {odocRequestStore, odocComsStore} = this.props;
        const {directname = ""} = odocRequestStore;
        let {requestParam = {}} = odocComsStore;
        requestParam = mobx.toJS(requestParam);
        delete requestParam.markInfo;

        if (!directname) {
            Bubble.error(getLabel(81968, "名称不能为空！"), 2);
            return;
        }

        odocRequestStore.saveDirection({...requestParam}, () => {
            Bubble.success(getLabel(512221, "保存成功!"));
            this.closeDialog();
        });
    }

    closeDialog() {
        const {odocRequestStore} = this.props;
        odocRequestStore.setModalVisible(pageTypes.USUAL_DIRECTION_DIALOG, false);
    }

    renderContent() {
        const {odocRequestStore} = this.props;

        return (
            <List>
                <InputItem
                    className="ca-auth-inputitem"
                    placeholder={getLabel(	523434, "请输入常用去向名称")}
                    onChange={v => {
                        odocRequestStore.setMember({directname: v});
                    }}/>
            </List>
        );
    }

    render() {
        const title = getLabel(507875, "常用去向");
        const footer = [
            {text: getLabel(31129, "取消"), onPress: this.closeDialog},
            {text: getLabel(501196, "确定"), onPress: this.saveDirection}
        ];

        const {odocRequestStore} = this.props;
        const {modalVisible} = odocRequestStore;
        const visible = modalVisible.get(pageTypes.USUAL_DIRECTION_DIALOG);

        return (
            <Modal
                visible={visible}
                transparent={true}
                maskClosable={false}
                onClose={this.closeDialog}
                title={title}
                footer={footer}
                className="sencond-auth-dialog"
                wrapClassName="second-auth-test"
            >
                {this.renderContent()}
            </Modal>
        );
    }

}